<template>
  <h1>一个人的信息</h1>
  <h2>姓名：{{person.name}}</h2>
  <h2>年龄：{{person.age}}</h2>
  <button @click="test">测试一下触发Demo组件的hello事件</button>
</template>

<script>
import {reactive} from 'vue'
export default {
    name: "DemoTwo",
    props:['school','msg'],
    emits:['hello'],
    setup(props,context){
      //数据
        let person=reactive({
          name:"张三",
          age:18
        })

      //setup的两个参数
      console.log("props",props)
      console.log("context",context)
      console.log("context.attrs",context.attrs) //相当于Vue2中的$attrs
      console.log("context.emit",context.emit) //触发自定义事件
      console.log("context.slots",context.slots) //插槽

      function test(){
          context.emit('hello',123456)
      }

      //返回一个对象（常用）
      return{
          person,
          test
      }
    },
}
</script>

<style scoped>

</style>
